import type { Configuration }from 'webpack';
import path from 'path'

import { rules } from './webpack.rules';
import { plugins } from './webpack.plugins';

rules.push({
  test: /\.css$/,
  use: [{ loader: 'style-loader' }, { loader: 'css-loader' }],
},{
  test: /\.less$/i,
  use: [
    // Creates `style` nodes from JS strings
    "style-loader",
    // Translates CSS into CommonJS
    "css-loader",
    // Compiles less to CSS
    "less-loader"
  ]
},{
  test: /\.s[ac]ss$/i,
  use: [
    // Creates `style` nodes from JS strings
    "style-loader",
    // Translates CSS into CommonJS
    "css-loader",
    // Compiles Sass to CSS
    "sass-loader",
    {
      loader: 'sass-resources-loader',
      options: {
        resources: path.resolve(__dirname,'./src/frontend/assets/css/theme/global.scss'), //改路径为存放less全局变量的路径
      }
    }
  ]
});

export const rendererConfig: Configuration = {
  module: {
    rules,
  },
  plugins,
  resolve: {
    extensions: ['.js', '.ts', '.jsx', '.tsx', '.css', 'scss', 'sass', 'less', '.vue', '.json'],
    alias: {
        vue: 'vue/dist/vue.cjs.js',
        '@': path.resolve(__dirname, 'src'),
        '@frontend': path.resolve(__dirname, 'src/frontend'),
        '@events': path.resolve(__dirname, 'src/frontend/eventBus/index.js'),
        '@components': path.resolve(__dirname, 'src/frontend/components')
    },
    fallback:{
      path: require.resolve("path-browserify")
    }
  },  
};
